import Vue from "vue";
import VueRouter from "vue-router";
import Static from "./static";
import store from "../store";
import { Message } from "element-ui";
Vue.use(VueRouter);

const router = new VueRouter({
  mode: "history",
  base: process.env.BASE_URL,
  routes: Static,
});
var flag = true;
//! 设置路由导航守卫
router.beforeEach(async (to, from, next) => {
  //! to要去的页面 from从哪里来 next放行
  if (to.path != "/login") {
    //! 获取本地中登录成功后的token 给变量token复制
    let token = sessionStorage.getItem("token");
    if (token) {
      //! 在vuex中分模块中将route的值赋值给ss 所有路径 
      var ss = await store.state.modeules.route;
      //! console.log(ss); 判断路由里的是否为空 flag = false 让它只执行一次 
      if (ss.length != 0 && flag) { //! 不为空 向下执行
        ss.forEach((item) => { //! 循环这个数字 将里面的路径动态加入到component中
          item.component = routePath(item.name);
          router.addRoute("Home", item);  //! 跳转 Home 中的文件
        });
        flag = false;
        next({ //! 防止页面刷新丢失
          ...to,
          replace: true,
        });
        // console.log(router.getRoutes());
      } else {
        next();
      }
    } else {
      //! 为空 提示请先登录 然后跳转到login页面 让用户登录
      Message({
        message: "请先登录",
        type: "warning",
      });
      next("/login"); //! 跳转登录页面
    }
  } else {
    next(); //! 放行
  }
});
//! 封装函数获取到每个文件的name
function routePath(name) {
  return () => import(`@/components/Home/${name}`);
}

export default router;
